<template>
  <div>
    <a-modal
      v-model="typeData.show"
      width="600px"
      style="overflow:hidden"
      @cancel="handleClose"
    >
      <div slot="title">
        <span>{{typeData.title}}</span>
      </div>
          <el-form
            :model="parames"
            :rules="rules"
            label-position="left"
            ref="parames"
            label-width="94px"
            class="addForm"
            size="small"
          >
            <el-row :gutter="40" style="padding: 30px 30px">
              <el-col :span="24">
                <el-form-item label="类型名称:" prop="causeTypeName" v-if="typeData.type == 'newType' || typeData.type == 'editType'">
                  <el-input size="small" v-model="parames.causeTypeName" placeholder="请输入"></el-input>
                </el-form-item>
                <el-form-item label="科目名称:" prop="causeSubjectName" v-if="typeData.type == 'newP' || typeData.type == 'editP'">
                  <el-input size="small" v-model="parames.causeSubjectName" placeholder="请输入"></el-input>
                </el-form-item>
                <el-form-item label="是否启用:" prop="enable" v-if="typeData.type == 'newP' || typeData.type == 'editP'">
                  <el-radio v-model="parames.enable" :label="true">是</el-radio>
                  <el-radio v-model="parames.enable" :label="false">否</el-radio>
                </el-form-item>
              </el-col> 
            </el-row>
          </el-form>
          <template slot="footer">
            <el-button size="small" type="primary" :loading="loadingBtn" @click="handleSend">保存</el-button>
            <el-button size="small" @click="handleClose">取消</el-button>
          </template>
    </a-modal>
  </div>
</template>

<script>
/*
一级菜单需要添加菜单名称/图标/序号
二级菜单需要添加菜单名称/url/父级菜单/序号
*/
export default {
  props: ["typeData"],
  data() {
    return {
      parames: {
        id: '',
        causeTypeId: '', //科目id
        enable: true, //是否启用
        causeTypeName: "", //类型名称
        causeSubjectName: '', //科目名称
      },
      loadingBtn: false,
      menuType: [],
      rules: {
        causeTypeName: [
          { required: true, message: "必填", trigger: "blur" },
        ],
        causeSubjectName: [
          { required: true, message: "必填", trigger: "blur" },
        ],
        enable: [
          { required: true, message: "必填", trigger: "blur" },
        ]
      },
    };
  },
  mounted() {},
  methods: {

    handleClose() {
      //关闭弹窗
      this.typeData.show = false;
    },
    handleSend () { //提交信息
      this.$refs['parames'].validate((valid) => {
        if (valid) {
          this.loadingBtn = true
          if (this.typeData.type == 'newType') {
            this.$post(this.$api.postExpenditureCauseTypeAdd,this.parames).then(response => {
              if (response.data.succeed) {
                this.$emit('checkRender')
                this.handleClose()
              }
            })
          } else if (this.typeData.type == 'editType') { //添加子菜单或功能项
            this.parames.id = this.typeData.id
            this.$post(this.$api.postExpenditureCauseTypeEdit,this.parames).then(response => {
              if (response.data.succeed) {
                this.$emit('checkRender')
                this.handleClose()
              }
            })
          } else if (this.typeData.type == 'newP') { //添加子科目
            this.parames.causeTypeId = this.typeData.id
            this.$post(this.$api.postExpenditureSubjectAdd,this.parames).then(response => {
              if (response.data.succeed) {
                this.$emit('checkRender')
                this.handleClose()
              }
            })
          } else if (this.typeData.type == 'editP') { //添加子科目
            this.parames.id = this.typeData.id
            this.parames.causeTypeId = this.typeData.causeTypeId
            this.$post(this.$api.postExpenditureSubjectEdit,this.parames).then(response => {
              if (response.data.succeed) {
                this.$emit('checkRender')
                this.handleClose()
              }
            })
          }
          setTimeout(() => {
            this.loadingBtn = false
          }, 300);
        }
      })
    },
    render () {
      if (this.typeData.type == 'editType') {
        this.parames.causeTypeName = this.typeData.name
      } else if (this.typeData.type == 'editP') {
        this.parames.causeSubjectName = this.typeData.name
        this.parames.enable = this.typeData.enable

      }
    },
    restData () {
        this.parames.id = ''
        this.parames.causeTypeName = ''
        this.parames.causeTypeId = ''
        this.parames.causeSubjectName = ''
        this.parames.enable = true
        this.$refs.parames.resetFields()
    }
  },
  computed: { //计算属性
    changeDialog () {
      return this.typeData.show
    }
  },
  watch: {
    changeDialog: {
      handler (curVal, oldVal) {
        if (curVal) {
          this.render()
        } else {
          this.restData()
        }
      }
    },
    deep: true
  }
};
</script>

<style scoped>
</style>
